<script setup>
import router from '@/router/index.js';
import IconLock from '@/components/icons/IconLock.vue';
import IconUser from '@/components/icons/IconUser.vue';
import useUserStore from '@/store/user.js'

function onClickLeft() {
    console.log("点击了返回");
    router.go(-1);
}

function loginAction(){
    console.log("点击了登录");
    let number = document.getElementById("number").value;
    let psw = document.getElementById("psw").value;
    console.log(number);
    console.log(psw);
    if(number == "admin" && psw == "123456"){
        const user = useUserStore();
        // user.isLogin = true;
        user.loginInfo.isLogin = true;
        user.loginInfo2.shit = "no fuck";
        console.log(`登录成功`,user);
        router.push({name:'home'});
    }else{
        alert("账号或密码错误");
    }
}

const clockTtest = ()=>{
    const user = useUserStore();
    console.log(user.loginInfo,user.loginInfo2);
}


</script>



<template>
    <button @click="clockTtest">点击按钮</button>
    <van-nav-bar title="登录" left-text="返回" left-arrow @click-left="onClickLeft" class="mt-4">
        </van-nav-bar>
    <div class="login-page-container flex flex-col items-center">
        <div class="logo mt-20 w-20 h-20">
            <img src="@/assets/logo.svg" alt="">
        </div>
        <div class="h-10 w-4/5 relative ">
            <IconUser class="absolute top-2" /> 
            <input type="text" id="number" class=" h-full w-full pl-8 border-b focus:border-sky-300" placeholder="输入账号或密码 ">
        </div>
        <div class="h-10 w-4/5 relative mt-4">
            <IconLock class="absolute top-2" /> 
            <input type="password" id="psw" class=" h-full w-full pl-8 border-b focus:border-sky-300" placeholder="输入密码 ">
        </div>
        <button class="mt-8 w-4/5 rounded-full bg-sky-500 text-white h-12 text-xl" @click="loginAction"> 登录</button>
    </div>
</template>
